<div class=" layui-card layadmin-header">
    <div class="layui-breadcrumb" lay-filter="breadcrumb">
        <a lay-href="">首页</a>
        <a>支付配置</a>
        <a><cite>修改支付接口</cite></a>
    </div>
</div>

<style>
    .layui-form-label {
        width:120px !important;
        margin-left:1%;
    }
    .layui-input-inline {
        width: 80% !important;
    }
</style>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-tab layui-tab-brief">
            <ul class="layui-tab-title">
                <li class="layui-this">支付接口</li>
            </ul>
            <div class="layui-tab-content">
                <form class="layui-form center">
                    <div class="layui-form-item">
                        <label class="layui-form-label">接口代码</label>
                        <div class="layui-input-inline">
                            <input type="text" name="ifCode" id="ifCode" placeholder="请输入接口代码" readonly="readonly" required lay-verify="required" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">接口名称</label>
                        <div class="layui-input-inline">
                            <input type="text" name="ifName" id="ifName" placeholder="请输入接口名称" required lay-verify="required" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">通道标识</label>
                        <div class="layui-input-inline" >
                            <select name="ifTypeCode" id="ifTypeCode" lay-filter="ifTypeCodeFilter">
                                <option value="">选择接口类型</option>
                            </select>
                        </div>
                    </div>
<!--                    <div class="layui-form-item">-->
<!--                        <label class="layui-form-label">支付类型</label>-->
<!--                        <div class="layui-input-inline" >-->
<!--                            <select name="payType" id="payType" lay-filter="payTypeFilter">-->
<!--                                <option value="">选择支付类型</option>-->
<!--                            </select>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                    <div class="layui-form-item">-->
<!--                        <label class="layui-form-label">应用场景</label>-->
<!--                        <div class="layui-input-inline" >-->
<!--                            <input type="radio" name="scene" title="移动APP" value="1" >-->
<!--                            <input type="radio" name="scene" title="移动网页" value="2" >-->
<!--                            <input type="radio" name="scene" title="PC网页" value="3" >-->
<!--                            <input type="radio" name="scene" title="微信公众平台" value="4" >-->
<!--                            <input type="radio" name="scene" title="手机扫码" value="5" >-->
<!--                        </div>-->
<!--                    </div>-->
                    <div class="layui-form-item">
                        <label class="layui-form-label">扩展参数</label>
                        <div class="layui-input-inline">
                            <textarea name="extra" id="extra" placeholder="当支付类型为网银支付时,可配置支持的银行列表.格式如:[{'bank':'zhonghang','code':'300008'},{'bank':'nonghang','code':'300009'}]" class="layui-textarea"></textarea>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">状态</label>
                        <div class="layui-input-inline" >
                            <input type="radio" name="status" title="开启" value="1" />
                            <input type="radio" name="status" title="关闭" value="0" />
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">备注信息</label>
                        <div class="layui-input-inline">
                            <input type="text" name="remark" placeholder="请输入备注信息" autocomplete="off" class="layui-input">
                        </div>
                    </div>

                    <div class="layui-form-item mchIdItem" style="display: none;">
                        <label class="layui-form-label">商户ID</label>
                        <div class="layui-input-inline">
                            <input type="text" name="mchId" id="mchId" placeholder="只能在通道标识编辑" autocomplete="off" class="layui-input" disabled>
                        </div>
                    </div>
                    <div class="layui-form-item mchKeyItem" style="display: none;">
                        <label class="layui-form-label">商户密钥</label>
                        <div class="layui-input-inline">
                            <input type="text" name="mchKey" id="mchKey" placeholder="只能在通道标识编辑" autocomplete="off" class="layui-input" disabled>
                        </div>
                    </div>
                    <div class="layui-form-item reqUrlItem" style="display: none;">
                        <label class="layui-form-label">接口地址</label>
                        <div class="layui-input-inline">
                            <input type="text" name="reqUrl" id="reqUrl" placeholder="只能在通道标识编辑" autocomplete="off" class="layui-input" disabled>
                        </div>
                    </div>
                    <div class="layui-form-item queryUrlItem" style="display: none;">
                        <label class="layui-form-label">查询地址</label>
                        <div class="layui-input-inline">
                            <input type="text" name="queryUrl" id="queryUrl" placeholder="只能在通道标识编辑" autocomplete="off" class="layui-input" disabled>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-input-inline">
                            <button type="button" class="layui-btn" lay-submit="" lay-filter="update">保存</button>
                            <a lay-href = "config/pay_interface/" class="layui-btn ">返回</a>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<script>

    layui.use(['form','table','util','admin',],function(){
        var form = layui.form
            , $ = layui.$
            , admin = layui.admin
            , layer = layui.layer
            , element = layui.element
            , table = layui.table;

        element.render('breadcrumb', 'breadcrumb'); //渲染导航信息

        var router = layui.router();
        var ifCode = router.search.ifCode;

        admin.req({
            type: 'post',
            url: layui.setter.baseUrl + '/config/pay_interface/get',
            data: {
                ifCode:ifCode,
            },
            error: function(err){
                layer.alert(err);
            },
            success: function(res){
                if(res.code == 0){
                    $('#ifCode').val(res.data.ifCode);
                    $('#ifName').val(res.data.ifName);
                    if(res.data.scene == '1') {
                        $("input[name='scene'][value='1']").attr("checked",true);
                    } else if(res.data.scene == '2') {
                        $("input[name='scene'][value='2']").attr("checked",true);
                    } else if(res.data.scene == '3') {
                        $("input[name='scene'][value='3']").attr("checked",true);
                    } else if(res.data.scene == '4') {
                        $("input[name='scene'][value='4']").attr("checked",true);
                    } else if(res.data.scene == '5') {
                        $("input[name='scene'][value='5']").attr("checked",true);
                    }
                    if(res.data.status == 1) {
                        $("input[name='status'][value='1']").attr("checked",true);
                    } else {
                        $("input[name='status'][value='0']").attr("checked",true);
                    }
                    $('#channelId').val(res.data.channelId);
                    $('#extra').val(res.data.extra);
                    $('#remark').val(res.data.remark);


                    //这个到后面再改改,或许需要重新写接口对接那边
                    var payInterfaceType = res.data;
                    console.dir(res.data);
                    // 将商户ID、商户密钥、接口地址和查询地址显示在相应的输入框中
                    $(".mchIdItem").show();
                    $(".mchKeyItem").show();
                    $(".reqUrlItem").show();
                    $(".queryUrlItem").show();
                    $("#mchId").val(payInterfaceType.ifTypeMchId);
                    $("#mchKey").val(payInterfaceType.ifTypeAppKey);
                    $("#reqUrl").val(payInterfaceType.ifTypeReqUrl);
                    $("#queryUrl").val(payInterfaceType.ifTypeQueryUrl);
                    var ifTypeCode = res.data.ifTypeCode;
                    var payType = res.data.payType;


//
                    // 加载支接口类型
                    admin.req({
                        type: 'post',
                        url: layui.setter.baseUrl + '/config/common/pay_interface_type_all',
                        error: function(err){
                            layer.alert(err);
                        },
                        success: function(res){
                            if(res.code == 0){
                                var ifTypeList = res.data;
                                //遍历赋值
                                for(var i in ifTypeList){
                                    $("#ifTypeCode").append('<option value= '+ifTypeList[i].ifTypeCode+'>'+ifTypeList[i].ifTypeName+'</option>');
                                }
                                $("#ifTypeCode").find('option[value="'+ifTypeCode+'"]').attr('selected', true);
                                form.render('select');
                            }
                        }
                    });

                    // 加载支付类型
                    admin.req({
                        type: 'post',
                        url: layui.setter.baseUrl + '/config/common/pay_type_all',
                        error: function(err){
                            layer.alert(err);
                        },
                        success: function(res){
                            if(res.code == 0){
                                var payTypeList = res.data;
                                //遍历赋值
                                for(var i in payTypeList){
                                    $("#payType").append('<option value= '+payTypeList[i].payTypeCode+'>'+payTypeList[i].payTypeName+'</option>');
                                }
                                $("#payType").find('option[value="'+payType+'"]').attr('selected', true);
                                form.render('select');
                            }
                        }
                    });

                    form.render();
                }
            }
        })

        form.on('submit(update)', function(data){
            admin.req({
                type: 'post',
                url: layui.setter.baseUrl + '/config/pay_interface/update', //模拟接口,
                data: data.field,
                error: function(err){layer.alert(err.msg,{title:"请求失败"})},
                success: function(res){
                    if(res.code == 0){
                        layer.alert(res.msg, {title: '保存成功'},function(index){
                            layer.close(index);
                            location.hash = '/config/pay_interface/';
                        });
                    }
                }
            })
            return false;
        });
    });
</script>
<!--<div class=" layui-card layadmin-header">-->
<!--    <div class="layui-breadcrumb" lay-filter="breadcrumb">-->
<!--        <a lay-href="">首页</a>-->
<!--        <a>支付配置</a>-->
<!--        <a><cite>修改支付接口</cite></a>-->
<!--    </div>-->
<!--</div>-->

<!--<style>-->
<!--    .layui-form-label {-->
<!--        width:120px !important;-->
<!--        margin-left:1%;-->
<!--    }-->
<!--    .layui-input-inline {-->
<!--        width: 80% !important;-->
<!--    }-->
<!--</style>-->
<!--<div class="layui-fluid">-->
<!--    <div class="layui-card">-->
<!--        <div class="layui-tab layui-tab-brief">-->
<!--            <ul class="layui-tab-title">-->
<!--                <li class="layui-this">支付接口</li>-->
<!--            </ul>-->
<!--            <div class="layui-tab-content">-->

<!--                <form class="layui-form center">-->
<!--                    <div class="layui-form-item">-->
<!--                        <label class="layui-form-label">接口代码</label>-->
<!--                        <div class="layui-input-inline">-->
<!--                            <input type="text" name="ifCode" id="ifCode" placeholder="请输入接口代码" readonly="readonly"  required lay-verify="required"  autocomplete="off" class="layui-input">-->
<!--                        </div>-->
<!--                    </div>-->
<!--                    <div class="layui-form-item">-->
<!--                        <label class="layui-form-label">接口名称</label>-->
<!--                        <div class="layui-input-inline">-->
<!--                            <input type="text" name="ifName" id="ifName" placeholder="请输入接口名称" required lay-verify="required"  autocomplete="off" class="layui-input">-->
<!--                        </div>-->
<!--                    </div>-->
<!--                    <div class="layui-form-item">-->
<!--                        <label class="layui-form-label">接口类型</label>-->
<!--                        <div class="layui-input-inline" >-->
<!--                            <select name="ifTypeCode" id="ifTypeCode" lay-filter="ifTypeCodeFilter">-->
<!--                                <option value="">选择接口类型</option>-->
<!--                            </select>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                    <div class="layui-form-item">-->
<!--                        <label class="layui-form-label">支付类型</label>-->
<!--                        <div class="layui-input-inline" >-->
<!--                            <select name="payType" id="payType" lay-filter="payTypeFilter">-->
<!--                                <option value="">选择支付类型</option>-->
<!--                            </select>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                    <div class="layui-form-item">-->
<!--                        <label class="layui-form-label">应用场景</label>-->
<!--                        <div class="layui-input-inline" >-->
<!--                            <input type="radio" name="scene" title="移动APP" value="1"  >-->
<!--                            <input type="radio" name="scene" title="移动网页" value="2"  >-->
<!--                            <input type="radio" name="scene" title="PC网页" value="3"  >-->
<!--                            <input type="radio" name="scene" title="微信公众平台" value="4" >-->
<!--                            <input type="radio" name="scene" title="手机扫码" value="5"  >-->
<!--                        </div>-->
<!--                    </div>-->
<!--                    <div class="layui-form-item">-->
<!--                        <label class="layui-form-label">扩展参数</label>-->
<!--                        <div class="layui-input-inline">-->
<!--                            <textarea name="extra" id="extra" placeholder="当支付类型为网银支付时,可配置支持的银行列表.格式如:[{'bank':'zhonghang','code':'300008'},{'bank':'nonghang','code':'300009'}]" class="layui-textarea"></textarea>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                    <div class="layui-form-item">-->
<!--                        <label class="layui-form-label">状态</label>-->
<!--                        <div class="layui-input-inline" >-->
<!--                            <input type="radio" name="status" title="开启" value="1" />-->
<!--                            <input type="radio" name="status" title="关闭" value="0" />-->
<!--                        </div>-->
<!--                    </div>-->
<!--                    <div class="layui-form-item">-->
<!--                        <label class="layui-form-label">备注信息</label>-->
<!--                        <div class="layui-input-inline">-->
<!--                            <input type="text" name="remark" placeholder="请输入备注信息" autocomplete="off" class="layui-input">-->
<!--                        </div>-->
<!--                    </div>-->
<!--                    <div class="layui-form-item">-->
<!--                        <div class="layui-input-inline">-->
<!--                            <button type="button" class="layui-btn" lay-submit="" lay-filter="update">保存</button>-->
<!--                            <a lay-href = "config/pay_interface/"  class="layui-btn ">返回</a>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                </form>-->
<!--            </div>-->
<!--        </div>-->
<!--    </div>-->
<!--</div>-->
<!--<script>-->
<!--    -->
<!--    layui.use(['form','table','util','admin',],function(){-->
<!--        var form = layui.form-->
<!--        , $ = layui.$-->
<!--        , admin = layui.admin-->
<!--        , layer = layui.layer -->
<!--        , element = layui.element-->
<!--        , table = layui.table;-->
<!--        -->
<!--        element.render('breadcrumb', 'breadcrumb'); //渲染导航信息-->
<!--        -->
<!--        var router = layui.router();-->
<!--        var ifCode = router.search.ifCode;-->

<!--        admin.req({-->
<!--            type: 'post',-->
<!--            url: layui.setter.baseUrl + '/config/pay_interface/get',-->
<!--            data: {-->
<!--                ifCode:ifCode,-->
<!--            },-->
<!--            error: function(err){-->
<!--                layer.alert(err);-->
<!--            },-->
<!--            success: function(res){-->
<!--                if(res.code == 0){-->
<!--                    $('#ifCode').val(res.data.ifCode);-->
<!--                    $('#ifName').val(res.data.ifName);-->
<!--                    if(res.data.scene == '1') {-->
<!--                        $("input[name='scene'][value='1']").attr("checked",true);-->
<!--                    }else if(res.data.scene == '2') {-->
<!--                        $("input[name='scene'][value='2']").attr("checked",true);-->
<!--                    }else if(res.data.scene == '3') {-->
<!--                        $("input[name='scene'][value='3']").attr("checked",true);-->
<!--                    }else if(res.data.scene == '4') {-->
<!--                        $("input[name='scene'][value='4']").attr("checked",true);-->
<!--                    }else if(res.data.scene == '5') {-->
<!--                        $("input[name='scene'][value='5']").attr("checked",true);-->
<!--                    }-->
<!--                    if(res.data.status == 1) {-->
<!--                        $("input[name='status'][value='1']").attr("checked",true);-->
<!--                    }else {-->
<!--                        $("input[name='status'][value='0']").attr("checked",true);-->
<!--                    }-->
<!--                    $('#channelId').val(res.data.channelId);-->
<!--                    $('#extra').val(res.data.extra);-->
<!--                    $('#remark').val(res.data.remark);-->

<!--                    var ifTypeCode = res.data.ifTypeCode;-->
<!--                    var payType = res.data.payType;-->

<!--                    // 加载支接口类型-->
<!--                    admin.req({-->
<!--                        type: 'post',-->
<!--                        url: layui.setter.baseUrl + '/config/common/pay_interface_type_all',-->
<!--                        error: function(err){-->
<!--                            layer.alert(err);-->
<!--                        },-->
<!--                        success: function(res){-->
<!--                            if(res.code == 0){-->
<!--                                var ifTypeList = res.data;-->
<!--                                //遍历赋值-->
<!--                                for(var i in ifTypeList){-->
<!--                                    $("#ifTypeCode").append('<option value= '+ifTypeList[i].ifTypeCode+'>'+ifTypeList[i].ifTypeName+'</option>');-->
<!--                                }-->
<!--                                $("#ifTypeCode").find('option[value="'+ifTypeCode+'"]').attr('selected', true);-->
<!--                                form.render('select');-->
<!--                            }-->
<!--                        }-->
<!--                    });-->

<!--                    // 加载支付类型-->
<!--                    admin.req({-->
<!--                        type: 'post',-->
<!--                        url: layui.setter.baseUrl + '/config/common/pay_type_all',-->
<!--                        error: function(err){-->
<!--                            layer.alert(err);-->
<!--                        },-->
<!--                        success: function(res){-->
<!--                            if(res.code == 0){-->
<!--                                var payTypeList = res.data;-->
<!--                                //遍历赋值-->
<!--                                for(var i in payTypeList){-->
<!--                                    $("#payType").append('<option value= '+payTypeList[i].payTypeCode+'>'+payTypeList[i].payTypeName+'</option>');-->
<!--                                }-->
<!--                                $("#payType").find('option[value="'+payType+'"]').attr('selected', true);-->
<!--                                form.render('select');-->
<!--                            }-->
<!--                        }-->
<!--                    });-->

<!--                    form.render();-->
<!--                }-->
<!--            }-->
<!--        })-->

<!--        form.on('submit(update)', function(data){-->
<!--            admin.req({-->
<!--                type: 'post',-->
<!--                url: layui.setter.baseUrl + '/config/pay_interface/update', //模拟接口,-->
<!--                data: data.field,-->
<!--                error: function(err){layer.alert(err.msg,{title:"请求失败"})},-->
<!--                success: function(res){-->
<!--                    if(res.code == 0){-->
<!--                        layer.alert(res.msg, {title: '保存成功'},function(index){-->
<!--                            layer.close(index);-->
<!--                            location.hash = '/config/pay_interface/';-->
<!--                        });-->
<!--                    }-->
<!--                }-->
<!--            })-->
<!--            return false;-->
<!--        });-->

<!--    });-->
<!--    -->
<!--</script>-->
